<template>
  <div class="swiper">
    <div class="swiper-wrapper">
      <div class="swiper-slide" v-for="(swiper, index) in list" :key="index">
        <img
          :src="'cover' in swiper ? swiper.cover : swiper.picture"
          width="100%"
          height="300px"
        />
      </div>
    </div>
  </div>
</template>
<script>
import Swiper from "swiper";
import 'swiper/css/swiper.css'
export default {
  props: ["list"],
  watch: {
    list: {
      immediate: true,
      handler(newVal, oldVal) {
        this.$nextTick(function () {
          var mySwiper = new Swiper(".swiper", {
            autoplay: true,
            loop: true, // 循环模式选项
          });
        });
      },
    },
  },
};
</script>

<style lang="less">
.swiper {
  margin-bottom: 30px;
}
</style>